import React , { useState } from 'react'
import loginCss from "../style/login.module.css";
import { Button, Checkbox, Form, Input } from 'antd';
import { useNavigate } from 'react-router-dom';
import service from "../service/loginService";

const  login :React.FC = ()=> {
  
  const [isSuccess, setIsSuccess] = useState(false);
  const navigate = useNavigate(); // 获取 navigate 方法

  const onFinish = (values: any) => {
    // console.log(values.username);
    console.log('Success:', values);
    
    service.login(values.username,values.password).then((res)=>{
      console.log(res.data.code);

      

      if(res.data.code == 200){
        setIsSuccess(true);
         // 登录成功，则自动跳转到首页
        navigate('/home'); 
      }
    })
   

 
  };
  
  const onFinishFailed = (errorInfo: any) => {
    console.log('Failed:', errorInfo);
  };
  
  

  return (
    <div className={loginCss.box}>
      <div className={loginCss.left}>
        <img src="" alt="" />
      </div>
      <div className={loginCss.right}>
        <div className={loginCss.contend}>
          <div className={loginCss.title}>欢迎使用建筑施工BPM管理系统</div>
          <Form
            name="basic"
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 16 }}
            style={{ maxWidth: 600 }}
            initialValues={{ remember: true }}
            onFinish={onFinish}
            onFinishFailed={onFinishFailed}
            autoComplete="off"
            className={loginCss.form}
          >
            <Form.Item
              label="用户名"
              name="username"
              rules={[{ required: true, message: '用户名不能为空' }]}
            >
              <Input />
            </Form.Item>

            <Form.Item
              label="密码"
              name="password"
              rules={[{ required: true, message: '密码不能为空' }]}
            >
              <Input.Password />
            </Form.Item>

            <Form.Item name="remember" valuePropName="checked" wrapperCol={{ offset: 8, span: 16 }}>
              <Checkbox>记住我</Checkbox>
            </Form.Item>

            <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
              <Button type="primary" htmlType="submit">
                登陆
              </Button>
            </Form.Item>
          </Form>
        </div>
      </div>
    </div>
  )
}

export default login